<template>
  <div class="app-container">
    <!--工具栏-->
    <div class="head-container">
      <el-button
        v-if="crud.optShow.add"
        v-permission="permission.add"
        class="filter-item"
        size="mini"
        type="primary"
        icon="el-icon-plus"
        @click="crud.toAdd"
      >
        新增{{ typeName }}
      </el-button>
      <!--表单组件-->
      <eForm :inputName="typeName"/>
      <!--表格渲染-->
      <el-table
        ref="table"
        v-loading="crud.loading"
        :data="crud.data"
        size="small"
        style="width: 100%"
        @selection-change="crud.selectionChangeHandler"
      >
        <el-table-column type="selection" width="55" />
        <el-table-column prop="modelCode" :label="typeName + '编码'" />
        <el-table-column prop="modelName" :label="typeName + '名称'" />
        <el-table-column prop="remark" :label="typeName + '描述'" />
        <el-table-column prop="updateBy" label="更新人" />
        <el-table-column prop="updateTime" label="更新时间" width="140px" />
        <el-table-column v-if="checkPer(['admin','factoryModel:list'])" label="操作" width="150px" align="center">
          <template slot-scope="scope">
            <el-button size="mini" icon="el-icon-search" @click="getDetailsDataById(scope.row.id)">查看</el-button>
          </template>
        </el-table-column>
      </el-table>
      <!--分页组件-->
      <pagination />
    </div>
  </div>
</template>

<script>
import crudFactoryModel from "@/api/factory/factoryModel";
import CRUD, { presenter, header, form, crud } from "@crud/crud";
import rrOperation from "@crud/RR.operation";
import pagination from "@crud/Pagination";
import eForm from "./form";
const defaultForm = {
  id: null,
  modelCode: null,
  modelName: null,
  modelType: null,
  remark: null,
  pid: null,
  createBy: null,
  createTime: null,
  updateBy: null,
  updateTime: null,
};
export default {
  name: "ChildrenList",
  components: { pagination, rrOperation, eForm },
  mixins: [presenter(), header(), form(defaultForm), crud()],
  props: [
    "pid",
    "modelType",
    "typeName",
    "getDetailsDataById",
    "initTree"
  ],
  watch: {
    pid(value) {
      this.crud.title = this.typeName;
      this.crud.query.pid = value;
      this.crud.toQuery();
    },
  },
  cruds() {
    return CRUD({
      title: this.propsData.typeName + "建模",
      url: "api/factoryModel",
      idField: "id",
      sort: "id,desc",
      queryOnPresenterCreated: false,
      crudMethod: { ...crudFactoryModel },
    });
  },
  data() {
    return {
      permission: {
        add: ["admin", "factoryModel:add"],
        edit: ["admin", "factoryModel:edit"],
        del: ["admin", "factoryModel:del"],
      },
      rules: {
        modelCode: [
          {
            required: true,
            message: "请输入" + this.typeName + "编码",
            trigger: "blur",
          },
        ],
        modelName: [
          {
            required: true,
            message: "请输入" + this.typeName + "名称",
            trigger: "blur",
          },
        ],
      },
    };
  },
  methods: {
    // 钩子：在获取表格数据之前执行，false 则代表不获取数据
    [CRUD.HOOK.beforeRefresh]() {
      return true;
    },
    //新增之前
    [CRUD.HOOK.beforeToAdd](crud, form) {
      form.pid = this.pid;
      form.modelType = parseInt(this.modelType) + 1;
      return true;
    },
    //提交之后
    [CRUD.HOOK.afterSubmit]() {
      //刷新树
      this.initTree();
      return true;
    },
    getPageTotal: function() {
      return this.crud.page.total
    }
  },
  mounted:function (){
    if(this.pid){
      this.crud.title = this.typeName;
      this.crud.query.pid = this.pid;
      this.crud.toQuery();
    }
  }

};
</script>

<style scoped>
</style>
